<template>
  <div>
    <div>{{msg}}</div>
    <div id="canvas"></div>
  </div>
</template>

<script>
// import {migrateDiagram} from '@bpmn-io/dmn-migrate';
import DmnJS from 'dmn-js/lib/Modeler';
import diagram from '../../resources/diagram.dmn';

export default {
  name: 'DmnDesigner',
  data() {
    return {
      msg: 'Helllo,VUE'
    }
  },
  methods: {

  },
  mounted() {
    // const dmnJS = new DmnViewer({
    //   container: '#canvas'
    // });
    //
    // try {
    //   const { warnings } = dmnJS.importXML(diagram);
    //
    //   if (warnings.length) {
    //     console.log('import with warnings', warnings);
    //   } else {
    //     console.log('import successful');
    //   }
    //
    //   dmnJS
    //       .getActiveViewer()
    //       .get('canvas')
    //       .zoom('fit-viewport');
    // } catch (err) {
    //   console.log('something went wrong:', err);
    // }
  },
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>

</style>
